<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

    <title> - 登录</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <link href="../css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="../css/animate.css" rel="stylesheet">
    <link href="../css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="../css/style.css" rel="stylesheet">
    <link href="../css/login.css" rel="stylesheet">
    <!--[if lt IE 9]>
    <meta request-equiv="refresh" content="0;ie.html" />
    <![endif]-->
    <script>
        if (window.top !== window.self) {
            window.top.location = window.location;
        }
    </script>

</head>

<body class="signin">
    <div class="signinpanel" style="width: 700px">
        <div class="row">
            <div class="col-sm-6">
                <form action="/authentication/form" method="post" id="passForm">
                    <h4 class="no-margins">密码登录：</h4>
                    <p class="m-t-md">登录到wlj后台</p>
                    <input type="text" class="form-control uname" placeholder="用户名" name="username"/>
                    <input type="password" class="form-control pword m-b" placeholder="密码" name="password"/>
                    <div class="form-group text-left">
                        <div class="checkbox i-checks col-sm-4">
                            <label class="no-padding">
                                <input name="remember-me" type="checkbox" value="true"><i></i>记住我
                            </label>
                        </div>
                        <div class="col-sm-8" style="padding-right: 0px">
                            <div class="col-sm-6" style="padding: 0px;position: relative;top:5px">
                                <input type="text" class="form-control" style="margin-top: 0px" placeholder="验证码" name="imageCode"/>
                            </div>
                            <div class="col-sm-6" style="padding: 0px;position: relative;top: 6px">
                                <img style="width: 100%;height: 100%" src="/code/image" onclick="changeCode();" id="imgCode">
                            </div>
                        </div>
                        <div class="col-sm-12" style="display:none;">
                            <span class="help-block m-b-none" id="errTip" style="color: #ac2925"><i class="fa fa-info-circle"></i>这里写点提示的内容</span>
                        </div>
                    </div>

                    <button class="btn btn-success btn-block" type="submit">登录</button>
                </form>
                <h3>社交登录</h3>
                <!-- /auth/* 的请求将被SocialAuthenticationFilter拦截处理，qq是配置的providerId-->
                <!-- SocialAuthenticationFilter的/auth/可以配置的!  比如  /qqLogin/${providerId}-->
                <!--触发将用户导向认证服务器的url(即下面的url)和服务提供商携带code回调我们的地址是一致的！因此在QQ那配置回调地址时要注意!-->
                <a href="/qqLogin/weixin">微信登录</a>
            </div>
            <div class="col-sm-6">
                <form action="/authentication/mobile" method="post" id="mobileForm">
                    <h4 class="no-margins">手机验证码登录：</h4>
                    <p class="m-t-md">登录到wlj后台</p>
                    <input type="text" class="form-control" placeholder="手机号" name="mobile"/>
                    <div class="form-group text-left">
                        <div class="checkbox i-checks col-sm-4">
                            <label class="no-padding">
                                <!--由于用户登录信息存于内存中，服务一旦重启用户就需重新登录，只要选择"记住我"，一个用户名对应的token-->
                                <!--将存在db中，并存在用户cookie，等用户下次请求且重启完毕后用户无需重新登录(系统读取cookie中的token自动登录上)-->
                                <input name="remember-me" type="checkbox" value="true"><i></i>记住我
                            </label>
                        </div>
                        <div class="col-sm-8" style="padding-right: 0px">
                            <div class="col-sm-6" style="padding: 0px;position: relative;top:5px">
                                <input type="text" class="form-control" style="margin-top: 0px" placeholder="验证码" name="smsCode"/>
                            </div>
                            <div class="col-sm-6" style="padding: 0px;position: relative;top: 6px">
                                <a href="/code/sms?mobile=1883423423">发送验证码</a>
                            </div>
                        </div>
                    </div>
                    <button class="btn btn-success btn-block" type="submit">登录</button>
                </form>
            </div>
        </div>
        <div class="signup-footer">
            <div class="pull-left">
                &copy; hAdmin
            </div>
        </div>
    </div>
    <!-- 全局js -->
    <script src="../js/jquery.min.js?v=2.1.4"></script>
    <script src="../js/bootstrap.min.js?v=3.3.6"></script>
    <!-- iCheck -->
    <script src="../js/plugins/iCheck/icheck.min.js"></script>
    <!-- jQuery Validation plugin javascript-->
    <script src="../js/plugins/validate/jquery.validate.min.js"></script>
    <script src="../js/plugins/validate/messages_zh.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery.form/4.2.2/jquery.form.js"></script>
    <script src="../js/login/login.js"></script>
    <script>
        function changeCode(){
            document.getElementById("imgCode").src="/code/image?"+Math.random();
        }
        $(document).ready(function () {
            $('.i-checks').iCheck({
                checkboxClass: 'icheckbox_square-green',
                radioClass: 'iradio_square-green',
            });
        });
    </script>
</body>
</html>
